/* lomoo.org
 * author: jakeplus@gmail.com
 */

/* reset */
html, head, body, form, table, thead, tbody, tr, td, div, h1, h2, h3, h4, h5, p, li, img, legend, fieldset, form {
    padding: 0; margin: 0;
}
body { font-family: Arial; width: 100%; font-size: 9pt; background: #000; }
img { border: 0; }
.hidden { display: none; }
.clear { clear: both; }
.left { float: left; }
.right { float: right; }

/* layout */
html, body { height: 100%; text-align: center; }
div#wrapper {
    min-height: 100%;
    height: auto !important;
    height: 100%;
    margin: 0 0 -140px;
    text-align: left;
}
div#footer, div#push { height: 140px; }

.column {
    margin: 0 auto;
    width: 960px;
    overflow: hidden;
}
.content { width: 690px; float: left; }
.side { width: 240px; float: right; }

#header {
    padding-top: 10px;
    text-align: right;
}
#content { padding: 20px 0; }
#footer { text-align: left; }

/* styles */
h1, h2 { font-family: "Microsoft Yahei", georgia; color: #333; }
h1 { font-size: 150%; margin-bottom: 10px; }
h2 { font-size: 120%; margin-top: 20px; margin-bottom: 10px; }
h1 a, h1 a:hover { color: #333; text-decoration: none; }

#content .content {
    padding: 10px; width: 670px; /* totals 690px*/
}
#content .content p {
    padding: 5px 0;
}
#footer .content p, #footer .side p {
    margin-bottom: 2px;
}
#footer .side {
    color: #333;
    padding: 10px;
    padding-right: 0;
}
.section {
    padding: 10px;
    margin-bottom: 10px;
}
.section_title {
    padding: 0 5px;
}
.quote {
    border-left: 5px solid #777;
    padding-left: 10px;
}
.top {
    margin-top: 2.5px;
}
.author, .submitter {
    color: #ddd;
}
.date {
    color: #bbb;
}
.section_title {
    margin-left: 5px;
}
.pic_caption p {
    _padding-top: 2.5px;  	/* ie6 and below.
				             * with prefix '*', will in effect in ie7 and below. */
}

/* background colors
 * all goes here including those modules:
 *  - navigators
 *  - comments
 *  - pictures
 *  - albums
 *  - sections
 */
#footer .wild, #footer .top span, .nav, #footer .comment li a {
    background: #333;
    background: rgba(48, 48, 48, 0.7);
    color: #ddd;
}
.section, .section_title, #content .content, #footer .content p, #disqus_thread {
    background-color: #eee;
    background: rgba(224, 224, 224, 0.7);
}
#nav li.selected {
    background-color: #777;
    background: rgba(112, 112, 112, 0.7);
}
/* ie work arounds of transparent background and opacity */
.nav, .section, #footer .content p, .wild, .section_title, #disqus_thread {
    /* http://www.quirksmode.org/css/opacity.html
     * this will make the whole block including contents transparent
     * which is not what we want */
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; /* ie8 */
    filter: alpha(opacity=80);	/* ie5-7*/
    zoom: 1;			/* let ie know that ul/div/p are all blocks. */
    /* http://www.daltonlp.com/view/217 */
}

/* navigators */
#header .nav li {
    padding: 0 1px;
}
#header .nav li a {
    display: block;
    padding: 2.5px 10px;
}
a.wild {
    text-decoration: none;
}
a.wild:hover {
    text-decoration: underline;
}
.nav {
    list-style: none;
    margin: 0; padding: 0;
}
.nav li {
    display: block;
    padding: 2.5px 10px;
    _padding-top: 5px;  	/* ie6 and below.
				             * with prefix '*', will in effect in ie7 and below. */
}
.nav li a {
    text-decoration: none;
    color: #ddd;
}
.nav li a:hover {
    text-decoration: underline;
}
#nav {
    float: right;
}
#nav li {
    float: left;
}
.form_cancel {
    margin-left: 10px;
}
li.feed a {
    background: url('feed.gif') no-repeat right;
    display: inline;
    padding-right: 20px;
}
.pager_box { text-align: right; }

/* forms */
form .formrow {
    margin-top: 10px;
}
label {
    display: block;
    padding-left: 5px;
}
label.inline {
    display: inline;
    padding-left: 0;
}
fieldset {
    border: solid 1px #333;
    border-left: none;
    border-right: none;
}
legend {
    margin-left: 10px;
}
input[type=text], textarea {
    border: 1px solid #777;
    padding: 2.5px;
}
input[type=button], input[type=submit], input[type=reset] {
    background-color: #777;
    color: #fff;
    border: 1px solid #333;
    border-left: none; border-top: none;
    padding: 5px 10px;
}
input[type=button]:hover, input[type=submit]:hover, input[type=reset]:hover {
    cursor: pointer;
}
input[type=radio] {
    padding: 0; margin: 0;
}

/* pictures */
.albums, .pics {
    list-style: none;
    padding: 0; margin: 0;
    margin-top: 10px;
    overflow: auto; zoom: 1;
}
.album {
    float: left; width: 330px; height: 100px;
    margin-top: 5px; overflow: hidden;
}
.album a.cover {
    float: left; margin-right: 10px; width: 60px;
}
.album .desc, .pic .desc, .pod_box .desc {
    margin-left: 70px;
    padding-left: 10px;
    border-left: 1px solid #bbb;
}
.pics { padding-bottom: 10px; }
.formrow .pics { padding-top: 10px; padding-bottom: 40px; }
.pic {
    float: left; overflow: hidden;
    margin-right: 10px; margin-top: 5px;
    width: 200px; height: 100px;
}
.pic_caption {
    margin-bottom: 10px;
}
.pic_title a {
    color: #ddd;
    text-decoration: none;
    background-color: #333;
    background: rgba(48, 48, 48, 0.7);
}
.pic_title a:hover {
    color: #fff;
}
.pod_box { overflow: auto; zoom: 1; }
.pod_box .left { padding-right: 10px; }
.tags { padding-bottom: 1px; }
.tag {
    display: inline-block;
    background-color: #bbb;
    border: 1px solid #777;
    padding: 2px 5px;
    border-top: 0; border-left: 0;
    text-decoration: none; color: #000;
}

/* notify box */
.notify_box {
    border: 5px solid #fff;
    width: 500px;
    overflow: auto;
    padding: 20px;
}
.notify {
    border-bottom: 1px solid #ddd; padding: 2.5px 5px;
    padding-left: 15px;
}
.options { margin-top: 10px; }
.notify_box .options a {
    font-size: 120%;
    float: left;
    margin-right: 10px;
    padding: 5px 10px;
}
.options a:hover {
    text-decoration: none;
}
.button {
    text-decoration: none;
    background-color: #777;
    color: #fff;
    border: 1px solid #333;
    border-left: none; border-top: none;
}

/* disqus thread */
#disqus_thread {
    padding: 10px;
    margin-top: 20px;
}
#disqus_thread h3 {
    color: #333;
    margin: 10px 0;
}

